irongit
Sign inRegister
huncholanehuncholane/dotbarPublic

Waybar configuration

dotbar/style/[0 VERTICAL] Oglo Chicklets.css
397 lines6.6 KBCSS
RawDownloadHistory
1/* ---- 💫 https://github.com/JaKooLit 💫 ---- */
2/* Oglo Chicklets */
3
4* {
5 font-family: "JetBrainsMono Nerd Font", FontAwesome, Roboto, Helvetica, Arial, sans-serif;
6 font-size: 97%;
7 font-weight: bold;
8}
9
10window#waybar {
11 background-color: #232a2e;
12 border-bottom: 8px solid #1d2327;
13 color: #d3c6aa;
14 transition-property: background-color;
15 transition-duration: .5s;
16}
17
18window#waybar.hidden {
19 opacity: 0.2;
20}
21
22/*
23window#waybar.empty {
24 background-color: transparent;
25}
26window#waybar.solo {
27 background-color: #FFFFFF;
28}
29*/
30
31button {
32 all: unset;
33 background-color: #778f52;
34 color: #2d353b;
35 border: none;
36 border-bottom: 8px solid #5d743e;
37 border-radius: 5px;
38 padding-left: 5px;
39 padding-right: 5px;
40 transition: transform 0.1s ease-in-out;
41}
42
43button:hover {
44 background: inherit;
45 background-color: #92ab6c;
46 border-bottom: 8px solid #788f57;
47}
48
49button.active {
50 background: inherit;
51 background-color: #a5be7e;
52 border-bottom: 8px solid #8aa168;
53}
54
55#mode {
56 background-color: #64727D;
57 border-bottom: 3px solid #ffffff;
58}
59
60#backlight,
61#backlight-slider,
62#battery,
63#bluetooth,
64#clock,
65#cpu,
66#disk,
67#idle_inhibitor,
68#keyboard-state,
69#memory,
70#mode,
71#mpris,
72#network,
73#power-profiles-daemon,
74#pulseaudio,
75#pulseaudio-slider,
76#taskbar,
77#temperature,
78#tray,
79#window,
80#wireplumber,
81#workspaces,
82#custom-backlight,
83#custom-browser,
84#custom-cava_mviz,
85#custom-cycle_wall,
86#custom-dot_update,
87#custom-file_manager,
88#custom-keybinds,
89#custom-keyboard,
90#custom-light_dark,
91#custom-lock,
92#custom-hint,
93#custom-hypridle,
94#custom-menu,
95#custom-playerctl,
96#custom-power_vertical,
97#custom-power,
98#custom-quit,
99#custom-reboot,
100#custom-settings,
101#custom-spotify,
102#custom-swaync,
103#custom-tty,
104#custom-updater,
105#custom-weather,
106#custom-weather.clearNight,
107#custom-weather.cloudyFoggyDay,
108#custom-weather.cloudyFoggyNight,
109#custom-weather.default,
110#custom-weather.rainyDay,
111#custom-weather.rainyNight,
112#custom-weather.severe,
113#custom-weather.showyIcyDay,
114#custom-weather.snowyIcyNight,
115#custom-weather.sunnyDay{
116 color: #ffffff;
117 padding-top: 2px;
118 padding-bottom: 2px;
119 border-radius: 5px;
120 padding-left: 5px;
121 padding-right: 5px;
122}
123
124#window,
125#workspaces {
126 margin: 5px;
127}
128
129/* If workspaces is the leftmost module, omit left margin */
130.modules-left > widget:first-child > #workspaces {
131 margin-left: 0;
132}
133
134/* If workspaces is the rightmost module, omit right margin */
135.modules-right > widget:last-child > #workspaces {
136 margin-right: 0;
137}
138
139#window {
140 background-color: #343f44;
141 color: #d3c6aa;
142 border-bottom: 8px solid #2b3539;
143}
144
145#custom-swaync {
146 background-color: #778f52;
147 color: #2d353b;
148 border-bottom: 8px solid #5d743e;
149}
150
151#custom-menu {
152 background-color: #778f52;
153 color: #2d353b;
154 border-bottom: 8px solid #5d743e;
155}
156
157#custom-power {
158 background-color: #ee606a;
159 color: #2d353b;
160 border-bottom: 8px solid #ca4853;
161 padding-left: 5px;
162}
163
164#custom-power_vertical{
165 background-color: #ee606a;
166 color: #2d353b;
167 border-bottom: 8px solid #ca4853;
168}
169
170#clock {
171 background-color: #96a84c;
172 color: #2d353b;
173 border-bottom: 8px solid #7a8c37;
174}
175
176#battery {
177 background-color: #3a998f;
178 color: #2d353b;
179 border-bottom: 8px solid #227d74;
180}
181
182@keyframes blink {
183 to {
184 background-color: #ffffff;
185 color: #000000;
186 }
187}
188
189#battery.critical:not(.charging) {
190 background-color: #ee606a;
191 color: #2d353b;
192 border-bottom: 8px solid #ca4853;
193 animation-name: blink;
194 animation-duration: 3.0s;
195 animation-timing-function: steps(12);
196 animation-iteration-count: infinite;
197 animation-direction: alternate;
198}
199
200label:focus {
201 background-color: #000000;
202}
203
204#cpu {
205 background-color: #778f52;
206 color: #2d353b;
207 border-bottom: 8px solid #5d743e;
208}
209
210#memory {
211 background-color: #d980ad;
212 color: #2d353b;
213 border-bottom: 8px solid #b86790;
214}
215
216#disk {
217 background-color: #964B00;
218 border-bottom: 8px solid #793300;
219}
220
221#custom-lock,
222#custom-light_dark,
223#backlight {
224 background-color: #64b6ac;
225 color: #2d353b;
226 border-bottom: 8px solid #4f9990;
227 padding-left: 5px;
228}
229
230#network {
231 background-color: #2980b9;
232}
233
234#network.disconnected {
235 background-color: #f53c3c;
236}
237
238#pulseaudio {
239 background-color: #d8ac47;
240 color: #2d353b;
241 border-bottom: 8px solid #b78f30;
242}
243
244#pulseaudio.muted {
245 background-color: #90b1b1;
246 color: #2a5c45;
247}
248
249#wireplumber {
250 background-color: #fff0f5;
251 color: #000000;
252}
253
254#wireplumber.muted {
255 background-color: #f53c3c;
256}
257
258#custom-media {
259 background-color: #66cc99;
260 color: #2a5c45;
261 min-width: 100px;
262}
263
264#custom-media.custom-spotify {
265 background-color: #66cc99;
266}
267
268#custom-media.custom-vlc {
269 background-color: #ffa000;
270}
271
272#temperature {
273 background-color: #f0932b;
274 border-bottom: 8px solid #b78f30;
275}
276
277#temperature.critical {
278 background-color: #eb4d4b;
279}
280
281#tray {
282 background-color: #e67f51;
283 color: #2d353b;;
284 border-bottom: 8px solid #c3653b;
285}
286
287#tray > .passive {
288 -gtk-icon-effect: dim;
289}
290
291#tray > .needs-attention {
292 -gtk-icon-effect: highlight;
293 background-color: #eb4d4b;
294}
295
296#idle_inhibitor {
297 background-color: #2d3436;
298}
299
300#idle_inhibitor.activated {
301 background-color: #ecf0f1;
302 color: #2d3436;
303}
304
305#mpd {
306 background-color: #66cc99;
307 color: #2a5c45;
308}
309
310#mpd.disconnected {
311 background-color: #f53c3c;
312}
313
314#mpd.stopped {
315 background-color: #90b1b1;
316}
317
318#mpd.paused {
319 background-color: #51a37a;
320}
321
322#language {
323 background: #00b093;
324 color: #740864;
325 min-width: 16px;
326}
327
328#keyboard-state {
329 background: #97e1ad;
330 color: #000000;
331 min-width: 16px;
332 border-bottom: 8px solid #78b48a;
333}
334
335#keyboard-state > label {
336 padding: 0 5px;
337}
338
339#keyboard-state > label.locked {
340 background: rgba(0, 0, 0, 0.2);
341}
342
343#scratchpad {
344 background: rgba(0, 0, 0, 0.2);
345}
346
347#scratchpad.empty {
348 background-color: transparent;
349}
350
351tooltip {
352 background-color: #232a2e;
353 border: none;
354 border-bottom: 8px solid #1d2327;
355}
356
357tooltip decoration {
358 box-shadow: none;
359}
360
361tooltip decoration:backdrop {
362 box-shadow: none;
363}
364
365tooltip label {
366 color: #d3c6aa;
367 padding-left: 5px;
368 padding-right: 5px;
369 padding-top: 0px;
370 padding-bottom: 5px;
371}
372
373
374#backlight-slider slider,
375#pulseaudio-slider slider {
376 min-height: 7px;
377 min-width: 15px;
378 opacity: 0;
379 background-color: #ffa000;
380 border-radius: 3px;
381 box-shadow: 1px 5px 6px 1px #272727;
382}
383
384#backlight-slider trough,
385#pulseaudio-slider trough {
386 min-height: 100px;
387 min-width: 7px;
388 border-radius: 5px;
389 background-color: #d8ac47;
390}
391
392#backlight-slider highlight,
393#pulseaudio-slider highlight {
394 min-width: 5px;
395 border-radius: 5px;
396 background-color: #64b6ac;
397}